import { SchemaManage } from '@/components/SchemaComponent';
import { ManageCommonAPI } from '@/pages/type';
import { useEffect, useMemo, useRef, useState } from 'react';
import { connect } from 'umi';
import { warnManageService } from '../services';
import { getTableColumns } from '../mconfig';
import '../common/style.less';
import { PlusOutlined } from '@ant-design/icons';
import { history } from 'umi';
import { fieldFlowExport, getKeyRouter, getTenantID } from '@/utils';

const WarnManageView: React.FC<WarnManageAPI.IManageType> = ({ curRes }) => {
  /** 管理页ref */
  const schemaManageRef: any = useRef();

  /**  获取管理页数据 */
  const { data, loading, pagination, searchList, getWarnData, reloadRefresh } = warnManageService(curRes);

  const [tableList, setTableList] = useState([]);

  const treeData = (data) => {
    for (let index = 0; index < data.length; index++) {
      const element = data[index];
      if (element.children.length > 0) {
        treeData(element.children);
      } else {
        element.children = null;
      }
    }
  };

  useEffect(() => {
    if (data?.obj) {
      treeData(data?.obj);
      setTableList(data?.obj);
    }
  }, [data]);

  useEffect(() => {
    // 判断是当前路由 刷新页面
    if (history.location.pathname == '/storeController/manage') {
      reloadManage();
    }
  }, [history.location.pathname]);

  /**  重置搜索表单方法 */
  const onReset = (values: any) => {
    getWarnData({ ...values });
  };

  const onExpandTable = () => {};

  /**  搜索列表 */
  const onSearch = (request: ManageCommonAPI.IGridRequestType) => {
    getWarnData({ ...request });
  };

  /** 分页change 方法 */
  const onPageChange = (current: any, pageSize: any, params: any) => {
    getWarnData({ pageSize, current, ...params });
  };

  /** 刷新管理页面 */
  const reloadManage = () => {
    reloadRefresh();
  };

  /** 表格操作按钮点击方法 */
  const onOptClick: any = {
    onEdit: (resObj) => {
      history.push({
        pathname: `/assetStore/edit/:${getKeyRouter()}${getKeyRouter()}`,
        state: {
          data: resObj,
          pageType: 'edit',
          returnPathName: history.location.pathname,
        },
      });
    },
  };

  /**新增操作按钮*/
  const actionList: any = useMemo(() => {
    return [
      {
        title: '添加',
        visible: curRes?.['/assetStore/add'] || false,
        type: 'primary',
        icon: <PlusOutlined />,
        onClick: () => {
          history.push({
            pathname: `/assetStore/add/:${getKeyRouter()}${getKeyRouter()}`,
            state: {
              pageType: 'add',
              returnPathName: history.location.pathname,
            },
          });
        },
      },
    ];
  }, [curRes]);

  /** 获取columns方法 */
  const columns: Record<string, any>[] = useMemo(() => {
    return getTableColumns(curRes, onOptClick, onSearch);
  }, [curRes]);

  return (
    <div
      style={{
        position: 'relative',
        overflow: 'hidden',
        height: '100%',
        width: '100%',
      }}
    >
      <SchemaManage
        ref={schemaManageRef}
        searchProps={{
          switchList: [],
          searchList,
          onSwitch: () => {},
          onReset,
          onSearch,
        }}
        actionList={actionList}
        tableProps={{
          columns,
          dataSource: tableList,
          loading,
          // pagination: pagination as any,
          pagination: false,
          rowKey: 'id',
          onPageChange, //分页onchange
          childrenColumnName: 'children',
          expandable: {
            indentSize: 20,
            onExpand: onExpandTable,
          },
        }}
      />
    </div>
  );
};

export default connect(({ baseLogin }: Record<string, any>) => ({
  curRes: baseLogin?.permissions,
}))(WarnManageView);
